<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <title>小学学区划分</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link href="../../plugins/mui/mui.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="../../css/excutive_housekeeper/school.css" />
    <script src="../../js/statistics.js"></script>
	<script charset="utf-8" src="http://map.qq.com/api/js?v=2.exp"></script>
</head>

<body>
	<header class="mui-bar mui-bar-nav header">
	    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
	    <h1 class="mui-title" id='title'>小学学区划分</h1>
	</header>
	<div id="container">
	</div>
	<div id="box"></div>
	<div class="search-box clear">
		<div class="input-box">
			<span></span>
			<input id="place" type="text"/ placeholder="请输入地址">
		</div>
		<span class="search-button" id="button">搜索</span>
	</div>
	<script src="../../plugins/jquery/jquery-3.1.0.min.js" type="text/javascript" ></script>
	<script src="../../plugins/mui/mui.min.js"></script>
	<script type="text/javascript">
	    mui.init();
	    mui.plusReady(function() {
	    	
	    });
	    $(function(){
	    	var center = new qq.maps.LatLng(31.4158393143,119.4845959033);
		    var map = new qq.maps.Map(document.getElementById('container'),{
		        center: center,
		        zoom: 14
		    });
		    //搜索
		    var searchService = new qq.maps.SearchService({
		        map : map
		    });
		    var button = document.getElementById('button');
		    button.addEventListener('tap',function(){
		    	var address = document.getElementById('place').value,
		    		localtion = '河东市';
	    		searchService.setLocation(localtion);
    			searchService.search(address);
		    },false);
		    //软键盘收回
		    document.getElementById('container').addEventListener('touchstart',function(){
		    	document.getElementById('place').blur();
		    },false);
		    //学区划分
		    var path = [
		    	[
		    		new qq.maps.LatLng(31.4046424001,119.4782388210),
        			new qq.maps.LatLng(31.4052971343,119.4709163904),
        			new qq.maps.LatLng(31.4274958719,119.4767636061),
			        new qq.maps.LatLng(31.4376252470,119.4793814421),
			        new qq.maps.LatLng(31.4389754425,119.4811356068),
			        new qq.maps.LatLng(31.4396390908,119.4834583998),
			        new qq.maps.LatLng(31.4393049788,119.4857168198),
			        new qq.maps.LatLng(31.4351673835,119.4863498211),
			        new qq.maps.LatLng(31.4334051885,119.4857490063),
			        new qq.maps.LatLng(31.4303201232,119.4900405407),
			        new qq.maps.LatLng(31.4279398847,119.4882005453),
			        new qq.maps.LatLng(31.4269694624,119.4866448641),
			        new qq.maps.LatLng(31.4242412403,119.4840162992),
			        new qq.maps.LatLng(31.4118075993,119.4803202152),
			        new qq.maps.LatLng(31.4046424001,119.4782388210)
		    	],
		    	[
		    		new qq.maps.LatLng(31.4280955175,119.4581383467),
			        new qq.maps.LatLng(31.4274958719,119.4767636061),
			        new qq.maps.LatLng(31.4242412403,119.4840162992),
			        new qq.maps.LatLng(31.4224605291,119.4878250360),
			        new qq.maps.LatLng(31.4226711034,119.4923150539),
			        new qq.maps.LatLng(31.4206156949,119.4970357418),
			        new qq.maps.LatLng(31.4187250456,119.5013058186),
			        new qq.maps.LatLng(31.4102372542,119.5113962889),
			        new qq.maps.LatLng(31.4093444807,119.5143145323)
		    	],
		    	[
		    		new qq.maps.LatLng(31.4393049788,119.4857168198),
			        new qq.maps.LatLng(31.4446277448,119.4847995043),
			        new qq.maps.LatLng(31.4469022998,119.4848638773)
		    	],
		    	[
		    		new qq.maps.LatLng(31.4303201232,119.4900405407),
			        new qq.maps.LatLng(31.4269236875,119.4944876432),
			        new qq.maps.LatLng(31.4227763904,119.4995194674),
			        new qq.maps.LatLng(31.4206156949,119.4970357418),
			        new qq.maps.LatLng(31.4166970185,119.4956088066),
			        new qq.maps.LatLng(31.4131078068,119.4956409931),
			        new qq.maps.LatLng(31.4137670601,119.4920200109),
			        new qq.maps.LatLng(31.4102601457,119.4921433926),
			        new qq.maps.LatLng(31.4118075993,119.4803202152)
		    	],
		    	[
		    		new qq.maps.LatLng(31.4323982050,119.4951850176),
			        new qq.maps.LatLng(31.4341878818,119.4957160950),
			        new qq.maps.LatLng(31.4464171880,119.5054149628)
		    	],
		    	[
		    		new qq.maps.LatLng(31.4303201232,119.4900405407),
			        new qq.maps.LatLng(31.4322288477,119.4925993681),
			        new qq.maps.LatLng(31.4320915307,119.4943910837),
			        new qq.maps.LatLng(31.4323982050,119.4951850176),
			        new qq.maps.LatLng(31.4318626685,119.4955873489),
			        new qq.maps.LatLng(31.4309517917,119.4974166155),
			        new qq.maps.LatLng(31.4302285766,119.4977492094),
			        new qq.maps.LatLng(31.4295923259,119.4985538721),
			        new qq.maps.LatLng(31.4283838953,119.4979155064),
			        new qq.maps.LatLng(31.4269236875,119.4944876432)
		    	],
		    	[
		    		new qq.maps.LatLng(31.4046424001,119.4782388210),
        			new qq.maps.LatLng(31.4014373416,119.5183110237)
		    	],
		    	[
		    		new qq.maps.LatLng(31.4046424001,119.4782388210),
			        new qq.maps.LatLng(31.3992166298,119.4768387079	),
			        new qq.maps.LatLng(31.3900768172,119.4784212112),
			        new qq.maps.LatLng(31.3878604160,119.5086282492)
		    	]
		    ];
		    var points = [
		    	new qq.maps.LatLng(31.4226100000,119.4721700000),
		    	new qq.maps.LatLng(31.4273700000,119.5037900000),
		    	new qq.maps.LatLng(31.4066000000,119.4931900000),
		    	new qq.maps.LatLng(31.3935000000,119.4898000000),
		    	new qq.maps.LatLng(31.4198100000,119.4798900000),
		    	new qq.maps.LatLng(31.4303700000,119.4859700000),
		    	new qq.maps.LatLng(31.4165000000,119.4906100000),
		    	new qq.maps.LatLng(31.4237400000,119.4868200000),
		    	new qq.maps.LatLng(31.4298500000,119.4940500000),
		    	new qq.maps.LatLng(31.4354500000,119.4903700000)
		    ]
		    var labels = [];
		    var schools = [
		    	"外国语小学","东升小学","第二实验小学","实验小学(燕山)","溧城中心小学","西平小学","文化小学","平陵小学","实验小学","昆仑小学"
		    ];
		    var titles = [
		    	"河东市外国语学校","河东市东升小学","河东市第二实验小学","河东市实验小学(燕山校区)","河东市溧城中心小学","河东市西平小学","河东市文化小学","河东市平陵小学","河东市实验小学","河东市昆仑小学"
		    ];
		    var contents = [
		    	"东面：清溪中路（清安桥）－清溪南路以西；北面：平陵西路（清安桥）以南（含南村村委，北水西村委的前水西、后水西、钟家庄、三家村失地农民生）。","南面：平陵东路以北；西面：昆仑南路－夏桥－人民路－工农桥（沿护城河）－东平桥－北固桥－北大街－徐格笪路以东。","南面：永平大道（G104）以北；西面：燕山南路以东；北面：台港路－南大街－南环路－昆仑南路－平陵东路以南。","南面：燕城大道以北；西面：燕山南路以东；北面：永平大道（G104）以南（含原城南乡地块生源）。","东面：燕山路－燕山中路以西；南面：永平大道（G104）以北；西边：清溪中路（清安桥）－清溪南路以东；北面：平陵中路（清安桥）以南（含三和社区、湾里村委失地农民生）。","东面：竹墅桥－码头街－西成桥－西大街以西；南面：平陵中路－清安桥以北；西面：清溪路（清安桥）－濑江桥－凤凰路（凤凰西桥）以东（含水韵华庭、曙光花园）；北面：凤凰路（凤凰东桥）－博爱路－博爱桥－和平桥－竹墅桥－以南（含胥渚社区失地农民生）。","东面：昆仑南路－南环路－南大街以西；南面：台港路以北；西面：燕山中路－燕山路以东；北面：平陵中路以南（含庄家社区失地农民生）。","东面：昆仑南路以西；南面：平陵中路以北；西面：西大街－西成桥－码头街－竹墅桥以东；北面：竹墅桥－人民路－夏桥以南。","支农桥（沿护城河）－荷花桥－北固桥－东平桥－工农桥，沿人民路至支农桥范围的区域内（含北河沿、北固小区、北大街单号和北大街116号、120号）。","东面：北固桥－北大街－徐格笪路以西（含昆仑东苑）；南面：北固桥－北河沿－竹墅桥－和平桥－博爱桥以北；西面：博爱桥－博爱路－肇庄路以东（含前棠社区、宋庄社区、棠下社区、徐格笪村委、昆仑村委、毛场村委、夏庄村委失地农民生）。"
		    ];
		    for(i=0;i<path.length;i++){
		    	var polyline = new qq.maps.Polyline({
			        path: path[i],
			        strokeColor: '#eb646a',
			        strokeWeight: 2,
			        editable:false,
			        map: map
			    });
		    }
		    for(i=0;i<points.length;i++){
		    	var marker = new qq.maps.Marker({
		    		position: points[i],
		    		map: map
		    	}),
		    	cssA = {
		    		color: "#333",
		    		fontSize: "12px",
		    		border: "1px solid #43ac45",
		    		padding: "0 2px",
		    		borderRadius: "4px"
		    	},
		    	offsetA= new qq.maps.Size(15, -23);
		    	labels[i] = new qq.maps.Label({
		    		position :points[i],
		    		map: map,
		    		content: schools[i],
		    		style: cssA,
		    		offset: offsetA
		    	});
		    	var markerIcon = new qq.maps.MarkerImage('../../images/icon/school.png');
		    	marker.setIcon(markerIcon);
		    	(function(n){
		    		qq.maps.event.addListener(labels[n],'click',function(){
			    		console.log(n)
			    		var html = '<div id="alert-box">' +
										'<div>' +
											'<img src="../../images/schools/primary-' + n + '.jpg">'+
											'<div class="content">学区学校：' + titles[n] +  '<br>学区范围：' + contents[n] + '</div>' +
											'<img class="close-icon" src="../../images/icon/close.png">' +
										'</div>'+
									'</div>';
						document.getElementById("box").innerHTML = html;
						var cssB = {
							color: "#fff",
				    		fontSize: "12px",
				    		background: "#43ac45",
				    		padding: "0 2px",
				    		borderRadius: "4px",
				    		border: "0"
						};
						for(var j=0;j<points.length;j++){
							if(j != n){
								labels[j].setStyle(cssA);
							}
						}
						labels[n].setStyle(cssB);
			    	});
		    	})(i);
		    }
		    $("#box").delegate('.close-icon','tap',function(){
		    	$("#box").empty();
		    })
		    
	    });	
	</script>
</body>

</html>